<template>
  <view>
    <comment :evaluationCount="evaluationCount" :evaluations="evaluations" :isEvaluation="isEvaluation"></comment>
    <view class="edit" @click="evaluateTap" v-if="isBuy===true">
      <image :src="IMAGE_CONFIG.pingLun1"></image>
      {{isBuy}}
    </view>
  </view>
</template>

<script>
import comment from "../../../components/courseDetails/comment.vue";
import {getReplyConfig, getReplyList} from "../../../api/product";
import {IMAGE_CONFIG} from '@/utils/imageConfig'

let app = getApp();
export default {
  name: "moreComments",
  components:{comment},
  data(){
    return{
      IMAGE_CONFIG: IMAGE_CONFIG.index,
      id:null,
      orderNo:null,
      isBuy:false,
      // 评价数量
      evaluationCount: 0,
      isEvaluation:false,
      // 评价数据
      evaluations: [],

      page: 1,
      limit: 20,
      theme: app.globalData.theme,
      loadend: false,
    }
  },
  onLoad(options) {
    this.id=options.id
    this.orderNo=options.orderNo
    this.isBuy=options.isBuy
  },
  onShow () {
    this.getProductReplyCount();
    this.getProductReplyList();
  },

  onReachBottom() {
    this.getProductReplyList()
  },
  methods: {
    /**
     * 获取评论统计数据
     *
     */
    getProductReplyCount: function () {
      let that = this;
      getReplyConfig(that.id).then(res => {
        that.$set(that, 'replyData', res.data);
      });
    },
    /**
     * 分页获取评论
     */
    getProductReplyList: function () {
      let that = this;
      if (that.loadend) return;
      getReplyList(that.id, {
        page: that.page,
        limit: that.limit,
        type: 0,
      }).then(res => {
        if(res.data.total>this.evaluations.length){
          this.evaluations = [...this.evaluations, ...res.data.list];
          that.$set(that, 'page', res.data.page + 1);
        }
        that.evaluationCount=res.data.total
      }).catch(err => {
      });
    },
    evaluateTap() {
      uni.navigateTo({
        url: "/pages/goods/goods_comment_con/index?orderNo=" + this.orderNo + "&id=" + this.id
      })
    },
  }
}
</script>

<style scoped lang="scss">
.edit{
  position: fixed;
  bottom: 50px;          /* 紧贴屏幕底部 */
  right: 10px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #8F4C38;
  display: flex;
  justify-content: center;
  align-items: center;

  image{
    width: 50%;
    height: 50%;
  }
}
</style>